﻿@page "/loopdeftable"
@attribute [TabItemOption(Text = "控制回路列表")]

@using BootstrapBlazor.Components
@using Microsoft.AspNetCore.Authorization
@using TrackSystem.Entities.Extensions
@using TrackSystem.UI.Server
@using TrackSystem.UI.Server.Components.Layout
@using TrackSystem.UI.Server.Components.Pages

@using Microsoft.AspNetCore.SignalR.Client
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using System.ComponentModel
@using System.ComponentModel.DataAnnotations


<h3>控制回路列表</h3>

<Divider></Divider>
<table class="table table-users">
    <thead>
        <tr>
            <th scope="col" style="width: 30px">ID</th>
            <th scope="col" style="width: 100px">名称</th>
            <th scope="col" style="width: 150px">描述</th>
            <th scope="col" style="width: 50px">过程值</th>
            <th scope="col" style="width: 50px">设定值</th>
            <th scope="col" style="width: 50px">输出值</th>
            <th scope="col" style="width: 50px">策略</th>
            <th scope="col" style="width: 50px">作用方式</th>
            <th scope="col" style="width: 50px">手自动</th>
            <th scope="col" style="width: 100px">PID</th>
            <th scope="col" style="width: 100px">限幅</th>
            <th scope="col" style="width: 100px">死区</th>
            <th scope="col" style="width: 100px">参数</th>
            <th scope="col" style="width: 50px">设备</th>
            <th scope="col" style="width: 100px">操作</th>
        </tr>
    </thead>

    <tbody>
        @if (_loopDtos.Any())
        {
            @foreach (var item in _loopDtos)
            {
                @if (_dictChanges[item.Id])
                {
                    <tr>
                        <td class="align-middle">@item.Id</td>
                        <td class="align-middle">@item.Name</td>
                        <td class="align-middle">@item.Description</td>
                        <td class="align-middle">@item.PVName</td>
                        <td class="align-middle">@item.SVName</td>
                        <td class="align-middle">@item.OPName</td>
                        <td class="align-middle">@item.Method</td>
                        <td class="align-middle">
                            <Switch IsDisabled="true" OnText="正向" OffText="反向" @bind-Value="@item.Dirction" DisplayText="作用方式" />
                        </td>
                        <td class="align-middle">
                            <Switch IsDisabled="true" OnText="手动" OffText="自动" @bind-Value="@item.Action" DisplayText="手自动" />
                        </td>
                        <td class="align-middle">@item.Params_P  @item.Params_I @item.Params_D</td>
                        <td class="align-middle">@item.OutLLimit ~ @item.OutHLimit</td>
                        <td class="align-middle">@item.NDeadZone ~ @item.PDeadZone</td>
                        <td class="align-middle">@item.Setting</td>
                        <td class="align-middle">@item.Equip.Name</td>
                        <td class="align-middle">
                            <button type="button" class="btn btn-info" onclick="@(() => OnSwitchToChanged(item.Id))"><i class="fa-solid fa-hammer"></i></button>
                            <PopConfirmButton Placement="Placement.Top"
                                                Color="Color.Danger"
                                                ConfirmIcon="fa-solid fa-triangle-exclamation text-danger"
                                                ConfirmButtonColor="Color.Danger"
                                                Text=""
                                                Content="确定删除数据吗？"
                                                OnConfirm="@(() => OnDeleteLoop(item.Id))">
                                <i class="fa-solid fa-delete-left"></i>
                            </PopConfirmButton>
                        </td>
                    </tr>
                }
                else
                {
                    <tr>
                        <td class="align-middle">@item.Id</td>
                        <td class="align-middle"><input type="text" class="form-control" @bind="@item.Name" /></td>
                        <td class="align-middle"><input type="text" class="form-control" @bind="@item.Description" /></td>
                        <td class="align-middle">
                            <Dropdown TValue="string" Items="PVNameItems" @bind-Value=@item.PVName Color="Color.Secondary"></Dropdown>
                        </td>
                        <td class="align-middle">
                            <Dropdown TValue="string" Items="SVNameItems" @bind-Value=@item.SVName Color="Color.Secondary"></Dropdown>
                        </td>
                        <td class="align-middle">
                            <Dropdown TValue="string" Items="SVNameItems" @bind-Value=@item.OPName Color="Color.Secondary"></Dropdown>
                        </td>
                        <td class="align-middle">
                            <Dropdown TValue="@LoopMethod" Items="LoopMethodItems" @bind-Value=@item.Method Color="Color.Secondary"></Dropdown>
                        </td>
                        <td class="align-middle">
                            <Switch OnText="正向" OffText="反向" @bind-Value="@item.Dirction" DisplayText="作用方式" />
                        </td>
                        <td class="align-middle">
                            <Switch OnText="手动" OffText="自动" @bind-Value="@item.Action" DisplayText="手自动" />
                        </td>
                        <td class="align-middle">
                            <BootstrapInputNumber @bind-Value="@item.Params_P" UseInputEvent="true" ShowLabel="true"/>
                            <BootstrapInputNumber @bind-Value="@item.Params_I" UseInputEvent="true" ShowLabel="true"/>
                            <BootstrapInputNumber @bind-Value="@item.Params_D" UseInputEvent="true" ShowLabel="true"/>
                        </td>
                        <td class="align-middle">
                            <BootstrapInputNumber @bind-Value="@item.OutLLimit" UseInputEvent="true" ShowLabel="true" />
                            <BootstrapInputNumber @bind-Value="@item.OutHLimit" UseInputEvent="true" ShowLabel="true" />
                        </td>
                        <td class="align-middle">
                            <BootstrapInputNumber @bind-Value="@item.NDeadZone" UseInputEvent="true" ShowLabel="true" />
                            <BootstrapInputNumber @bind-Value="@item.PDeadZone" UseInputEvent="true" ShowLabel="true" />
                        </td>
                        <td class="align-middle"><input type="text" class="form-control" @bind="@item.Setting" /></td>
                        <td class="align-middle">
                            <Dropdown TValue="int" Items="equipList" Color="Color.Secondary" @bind-Value="@item.equipId"></Dropdown>
                        </td>
                        <td class="align-middle">
                            <button type="button" class="btn btn-primary" onclick="@(() => OnAcceptChanged(item))">保存</button>
                            <button type="button" class="btn btn-secondary" onclick="@(() => OnRefuseChanged(item))">取消</button>
                        </td>
                    </tr>
                }
            }
        }

        @if (bInsertFlag)
        {
            <tr>
                <td class="align-middle"></td>
                <td class="align-middle"><input type="text" class="form-control" @bind="@addedLoop.Name" /></td>
                <td class="align-middle"><input type="text" class="form-control" @bind="@addedLoop.Description" /></td>
                <td class="align-middle">
                    <Dropdown TValue="string" Items="PVNameItems" @bind-Value=@addedLoop.PVName Color="Color.Secondary" class=""></Dropdown>
                </td>
                <td class="align-middle">
                    <Dropdown TValue="string" Items="SVNameItems" @bind-Value=@addedLoop.SVName Color="Color.Secondary"></Dropdown>
                </td>
                <td class="align-middle">
                    <Dropdown TValue="string" Items="SVNameItems" @bind-Value=@addedLoop.OPName Color="Color.Secondary"></Dropdown>
                </td>
                <td class="align-middle">
                    <Dropdown TValue="@LoopMethod" Items="LoopMethodItems" @bind-Value=@addedLoop.Method Color="Color.Secondary" ></Dropdown>
                </td>
                <td class="align-middle">
                    <Switch OnText="正向" OffText="反向" @bind-Value="@addedLoop.Dirction" DisplayText="作用方式" />
                </td>
                <td class="align-middle">
                    <Switch OnText="手动" OffText="自动" @bind-Value="@addedLoop.Action" DisplayText="手自动" />
                </td>
                <td class="align-middle">
                    <BootstrapInputNumber @bind-Value="@addedLoop.Params_P" UseInputEvent="true" ShowLabel="true" />
                    <BootstrapInputNumber @bind-Value="@addedLoop.Params_I" UseInputEvent="true" ShowLabel="true" />
                    <BootstrapInputNumber @bind-Value="@addedLoop.Params_D" UseInputEvent="true" ShowLabel="true" />
                </td>
                <td class="align-middle">
                    <BootstrapInputNumber @bind-Value="@addedLoop.OutLLimit" UseInputEvent="true" ShowLabel="true" />
                    <BootstrapInputNumber @bind-Value="@addedLoop.OutHLimit" UseInputEvent="true" ShowLabel="true" />
                </td>
                <td class="align-middle">
                    <BootstrapInputNumber @bind-Value="@addedLoop.NDeadZone" UseInputEvent="true" ShowLabel="true" />
                    <BootstrapInputNumber @bind-Value="@addedLoop.PDeadZone" UseInputEvent="true" ShowLabel="true" />
                </td>
                <td class="align-middle"><input type="text" class="form-control" @bind="@addedLoop.Setting" /></td>
                <td class="align-middle">
                    <Dropdown TValue="int" Items="equipList" Color="Color.Secondary" @bind-Value="@addedLoop.equipId"></Dropdown>
                </td>
                <td class="align-middle">
                    <button type="button" class="btn btn-primary" @onclick=OnAcceptInsert>保存</button>
                    <button type="button" class="btn btn-secondary" @onclick=OnRefuseInsert>取消</button>
                </td>
            </tr>
        }
    </tbody>

</table>

<br/>
@if (!bInsertFlag)
{
    <button type="button" class="btn btn-secondary" @onclick="OnSwitchToInsert">新增</button>
}
<br />

<Divider></Divider>
<Pagination PageCount="@MaxPageNumber" Alignment="Alignment.Center" class="mt-3" OnPageLinkClick="@OnPageClick" >
    <PageInfoTemplate>
        <div class="page-info me-2">@PageInfoText</div>
        <Select @bind-Value="PageItems" Items="PageItemsSource" OnSelectedItemChanged="@OnPageItemsChanged"></Select>
    </PageInfoTemplate>
</Pagination>

<Divider></Divider>
<div class="row">
        @_sMsg
</div>


<style>
    /* 添加下拉菜单容器滚动条 */
    .dropdown-menu {
        max-height: 200px; /* 限制最大高度 */
        overflow-y: auto; /* 垂直滚动条 */
        scrollbar-width: thin; /* 细滚动条样式 */
    }

    /* 滚动条美化（可选）*/
    .dropdown-menu::-webkit-scrollbar {
        width: 6px;
    }

    .dropdown-menu::-webkit-scrollbar-thumb {
        background: #888;
        border-radius: 3px;
    }
</style>
